<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        /*方式一使用boder实现三角形*/
        #sjx1{
            width: 0px;
            height: 0px;
            border-top: 100px solid red;
            border-right:50px solid transparent;/*transparent表示透明*/
            border-bottom:50px solid transparent;
            border-left:50px solid transparent;
        }
        /*方式二:使用 linear-gradient(线性渐变)绘制三角形[宽高相等]*/
        #sjx2{
            width: 100px;
            height: 100px;
            background: linear-gradient(45deg,deeppink 50%,transparent 50%);/*将正方形斜对半分开再通过transparent透明色隐藏一半*/
        }
        /*方式三:conic-gradient(角向渐变)绘制三角形*/
        #sjx3{
            width: 200px;
            height: 120px;
            background: conic-gradient(from 90deg at 50% 0, deeppink 0, deeppink 45deg, transparent 45.1deg);
        }
        /*方式四:使用 clip-path 绘制三角形*/
        #sjx4{
            width: 100px;
            height: 100px;
            background-color: red;
            clip-path: polygon(0 0,100% 0,0 100%,0 0);
        }
        /*方式五:使用字符&#9660;*/
        #sjx5{
            font-size: 200px;
            color: red;
        }
    </style>
</head>
<body>
    机试题
    <button onclick="testjl(2000)">测试节流</button>
    <button onclick="testfangdou(2000)">测试防抖</button>
    <h1>三角形实现方式</h1>
    <div id="sjx1"></div>
    <div id="sjx2"></div>
    <div id="sjx3"></div>
    <div id="sjx4"></div>
    <div id="sjx5">&#9660;</div>
</body>
<script>
    /**
     *  数组去重
     */
    let sz=[1,3,4,2,1,3]
    //方案1
    function qc(arr){
        return Array.from(new Set(arr));
    }
    //方案2
    function qc2(arr){
        for(let i=0;i<arr.length;i++){
            for(let j=i+1;j<arr.length;j++){
                if(arr[i]==arr[j]){
                    arr.splice(j,1)
                }
            }
        }
    return arr;
    }
    console.log(qc2(sz))

    /**
     *  选择排序
     */
    let sz1=[1,2,13,0,42]
    function px(arr){
        var num=0;
        for(let i=0;i<arr.length-1;i++){
            for(let j=i+1;j<arr.length;j++){
                if(arr[i]<arr[j]){
                    num=arr[i];
                    arr[i]=arr[j];
                    arr[j]=num;
                }
            }
        }
        return arr;
    }
    console.log("选择排序",px(sz1))

    /**
     * 冒泡排序
     */
    function mpsort(arr){
        for(let i=0;i<arr.length-1;i++){
            for(let j=0;j<arr.length-1-i;j++){
                if(arr[j]>arr[j+1]){
                    var team=arr[j];
                    arr[j]=arr[j+1];
                    arr[j+1]=team;
                }
            }
        }
        return arr;
    }
    console.log("冒泡排序",mpsort(sz1))
    /**
     * 快速排序
     */
     function kssort(arr){
            if (arr.length <= 1) return arr; var centerIndex = ~~(arr.length / 2); var left = []; var right = [];
            for (var i = 0; i < arr.length; i++) { 
                if (i === centerIndex) continue; 
                if (arr[i] < arr[centerIndex]) left.push(arr[i]); 
                else right.push(arr[i]); 
            }
            return kssort(left).concat(arr[centerIndex], kssort(right)); 
            }
        
        console.log("快速排序",kssort(sz1));

        /**
         * 节流
         */
         var timeout;
        function jieliu(fun,time){
           return function(){
            if(timeout)return
            timeout=setTimeout(function(){
                fun();
                clearTimeout(timeout);
                timeout=null;
            },time)
           }
        }
        //测试节流
        function testjl(time){
           let myjieliu=jieliu(function(){
                console.log("测试节流")
            },time)
            myjieliu();
        }

        /**
         * 防抖
         */
        var timer;
        function fangdou(fun,time){
            return function(){
                clearTimeout(timer);//进来则进行倒计时清除
                timer=setTimeout(() => {
                    fun();
                }, time);
            }
        }
         //测试防抖
         function testfangdou(time){
           let myfangdou=fangdou(function(){
                console.log("测试防抖")
            },time)
            myfangdou();
        }
</script>
</html>